<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>销售订单</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="../../../elementUI/index.css">
  <link rel="stylesheet" href="../../../css/index.css">
</head>

<body>
  <div id="app" class="minWidth">
    <el-form :inline="true" :form="form">
      <el-form-item>
        <el-radio @input="RadioChange" v-model="form.Order_Type" label="0">用户</el-radio>
        <el-radio @input="RadioChange" v-model="form.Order_Type" label="1">经销商</el-radio>
      </el-form-item>
      <el-form-item label="商品名称:">
        <el-input v-model="form.Article_Name" placeholder="请输入商品名" />
      </el-form-item>
      <el-form-item v-if="form.Order_Type=='0'" label="时间范围:">
        <div class="block">
          <el-date-picker v-model="MyDate" value-format="yyyy-MM-dd" type="daterange" range-separator="至"
            start-placeholder="开始日期" end-placeholder="结束日期">
          </el-date-picker>
        </div>
      </el-form-item>
      <el-form-item v-if="form.Order_Type=='1'" label="经销商:">
        <el-select @change="SelectDistributors" v-model="form.distributors" clearable placeholder="请选择经销商">
          <el-option
            v-for="item in distributors"
            :key="item.Dealer_SerialNumber"
            :label="item.Dealer_Name"
            :value="item.Dealer_SerialNumber">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSerach">查询</el-button>
      </el-form-item>
      <el-form-item>
        <el-button v-if="form.Order_Type=='0'" type="primary" @click="dialogVisible1 = true">导入</el-button>
      </el-form-item>
      <el-form-item>
        <el-button v-if="form.Order_Type=='0'" type="primary" @click="onExcel">导出</el-button>
      </el-form-item>
      <el-form-item v-if="form.Order_Type=='1'" label="待收金额:">
        <span style="font-size: 2rem;font-weight: bold;">￥{{Pricethousands(statistics.Sales_Amount)}}</span>
      </el-form-item>
      <el-form-item v-if="form.Order_Type=='1'" label="已收金额:">
        <span style="font-size: 2rem;font-weight: bold;">￥{{Pricethousands(statistics.Collection_Amount)}}</span>
      </el-form-item>
      <!-- <el-form-item>
        <el-button type="primary" @click="dialogVisible = true">订单筛选</el-button>
      </el-form-item> -->
      <!-- <div class="block">
        <span class="demonstration">默认</span>
        <el-date-picker v-model="value1" type="daterange" @change="changeTime" range-separator="至"
          start-placeholder="开始日期" end-placeholder="结束日期">
        </el-date-picker>
      </div> -->

    </el-form>
    <div v-if="form.Order_Type=='0'">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="全部" name="first"></el-tab-pane>
        <el-tab-pane label="未付款"></el-tab-pane>
        <el-tab-pane label="已付款"></el-tab-pane>
        <el-tab-pane label="待发货"></el-tab-pane>
        <el-tab-pane label="发货中"></el-tab-pane>
        <el-tab-pane label="已送达"></el-tab-pane>
        <el-tab-pane label="当日发货"></el-tab-pane>
        <el-tab-pane label="已退款"></el-tab-pane>
      </el-tabs>

      <el-table v-if="form.Order_Type=='0'" :data="tableData" id="out-table" stripe border height="calc(100vh - 200px)"
        style="width: 100% ;">
        <el-table-column label="序号" width="50" type="index"></el-table-column>
        <el-table-column prop="Sales_Order_SerialNumber" min-width="180" label="销售订单号"></el-table-column>
        <el-table-column prop="Store_Name" label="门店名称" min-width="100"></el-table-column>
        <el-table-column prop="Article_Name" label="商品信息" min-width="200"></el-table-column>
        <el-table-column prop="Sales_Date" label="销售日期" min-width="180"></el-table-column>
        <el-table-column prop="Sales_Contacts" label="顾客名称" min-width="100"></el-table-column>
        <el-table-column prop="Sales_Address" label="顾客地址" min-width="300"
          style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"></el-table-column>
        <el-table-column prop="Sales_Phone" width="120" label="顾客电话" min-width="100"></el-table-column>
        <el-table-column prop="Sales_Amount" label="消费总额" min-width="80"></el-table-column>
        <el-table-column prop="Collection_Amount" label="实收金额" min-width="80"></el-table-column>
        <el-table-column prop="Row_Status" label="付款状态" width="90">
          <template v-slot="{ row }">
            <div v-if="form.Order_Type=='0'">
              <el-tag v-if="row.Row_Status==1&&row.Refund_Type==0" size="small">已付款</el-tag>
              <el-tag v-else-if="row.Row_Status==0&&row.Refund_Type==0" size="small">未付款</el-tag>
              <el-tag v-else-if="row.Row_Status==4&&row.Refund_Type==0" size="small">已退款</el-tag>
              <el-tag v-else-if="row.Row_Status==6&&row.Refund_Type==0" size="small">发货中</el-tag>
              <el-tag v-else-if="row.Row_Status==7&&row.Refund_Type==0" size="small">已送达</el-tag>
              <el-tag v-else-if="row.Row_Status==9&&row.Refund_Type==0" size="small">待发货</el-tag>
              <el-tag v-else-if="row.Refund_Type==1" size="small">退款审核</el-tag>
              <el-tag v-else type="danger" size="small">已取消</el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="Receive_Type" label="订单状态" width="140">
          <template v-slot="{row}">
            <div v-if="form.Order_Type=='0'">
              <el-tag v-if="row.Receive_Type==1" @click="AddMember(row)" type="success"
                size="small">{{row.Supplier_Name!=''?row.Supplier_Name:'已分配供应商'}}</el-tag>
              <el-tag v-else-if="row.Receive_Type==0" @click="AddMember(row)" size="small">可点击分配供应商</el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="Sign" label="订单类型" width="90"></el-table-column>
        <el-table-column property="Quantity" label="数量"></el-table-column>
        <el-table-column prop="Logistics_Date" width="110" label="发货时间"></el-table-column>
        <el-table-column prop="LogisticsNumbers" label="物流单号" width="110"></el-table-column>
        <el-table-column label="操作" width="300">
          <template v-slot="{row}">
            <div style="display: flex;justify-content: center;">
              <el-button
                v-if="row.Row_Status==1&&row.Refund_Type==0 || row.Row_Status==6&&row.Refund_Type==0||row.Row_Status==7&&row.Refund_Type==0||row.Row_Status==9&&row.Refund_Type==0"
                type="primary" size="small"
                @click="refund(row.Sales_Order_SerialNumber,row.Collection_Amount)">申请退款</el-button>
              <el-button v-else disabled type="primary" size="small">申请退款</el-button>
              <el-button type="success" size="small" @click="showMember(row.Sales_Order_SerialNumber)">查看</el-button>
              <el-button type="success" size="small" v-if="row.Row_Status==9"
                @click="onShipped(row.Sales_Order_SerialNumber,row,row.Quantity)">已发货</el-button>
              <el-button :type="row.Row_Status==6 || 9?'success':'info'" size="small"
                @click="delivered(row.Sales_Order_SerialNumber,row.Row_Status)">已送达</el-button>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div v-else-if="form.Order_Type=='1'">
      <el-table v-if="form.Order_Type=='1'" :data="tableData" border style="width: 100%">
        <el-table-column align="center" label="序号" width="50" type="index"></el-table-column>
        <el-table-column align="center" prop="Purchase_Order_SerialNumber" label="采购编号" width="180"></el-table-column>
        <el-table-column align="center" prop="Dealer_Name" label="经销商名称">
          <template v-slot="{row}">
            <div v-if="form.Order_Type=='1'" :title="row.Dealer_Name"
              style="width: 100%; overflow: hidden;white-space: nowrap; text-overflow: ellipsis;">
              <span>{{row.Dealer_Name}}</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column align="center" prop="Purchase_Date" label="销售日期" width="180">
        </el-table-column>
        <el-table-column align="center" prop="Article_Name" label="商品名称"></el-table-column>
        <el-table-column prop="Specifications_Name" label="规格"></el-table-column>
        <el-table-column prop="Quantity" label="购买数量"></el-table-column>
        <el-table-column label="SKU数量">
          <template v-slot="{row}">
            {{Number(row.Quantity)*Number(row.Packing)}}
          </template>
        </el-table-column>
        <el-table-column align="center" label="商品金额">
          <template v-slot="{row}">
            {{Pricethousands(row.Article_UnitPrice)}}
          </template>
        </el-table-column>
        <el-table-column align="center" label="销售订单金额">
          <template v-slot="{row}">
            {{Pricethousands(row.Purchase_Amount)}}
          </template>
        </el-table-column>
        <el-table-column align="center" label="对方已付金额">
          <template v-slot="{row}">
            {{Pricethousands(row.Paid_Amount)}}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="diffPrice" label="对方未付金额">
          <template v-slot="{row}">
            <span :style="`color: ${Number(row.Purchase_Amount)-Number(row.Confirm_Amount)==0?'#42b983':'#DC143C'};`">{{
              Pricethousands(Number(row.Purchase_Amount) -Number(row.Confirm_Amount)) }}</span>
          </template>
        </el-table-column>
        <el-table-column align="center" prop="Confirm_Amount" label="确认金额">
          <template v-slot="{row}">
            {{Pricethousands(row.Confirm_Amount)}}
          </template>
        </el-table-column>
        <el-table-column align="center" prop="Logistics_Numbers" label="物流单号"></el-table-column>
        <el-table-column align="center" prop="Logistics_Date" label="发货日期"></el-table-column>
        <el-table-column align="center" prop="Row_Status" label="状态">
          <template v-slot="{row}">
            <div v-if="form.Order_Type=='1'">
              <el-tag v-if="row.Row_Status=='0'">待对方付款</el-tag>
              <el-tag v-if="row.Row_Status=='1'" type="success">待确认</el-tag>
              <el-tag v-if="row.Row_Status=='2'" type="info">已过期</el-tag>
              <el-tag v-if="row.Row_Status=='3'" type="info">待发货</el-tag>
              <el-tag v-if="row.Row_Status=='4'" type="warning">已发货</el-tag>
              <el-tag v-if="row.Row_Status=='5'" type="danger">已送达</el-tag>
              <el-tag v-if="row.Row_Status=='6'" type="danger">对方已验收</el-tag>
              <el-tag v-if="row.Row_Status=='7'" type="danger">结束</el-tag>
            </div>
          </template>
        </el-table-column>
        <el-table-column align="center" label="操作" width="180">
          <template v-slot="{row}">
            <el-button v-if="row.Row_Status=='1'&&row.Trading_Detail_SerialNumber.includes('T01000000000001_1')"
              :loading="loading" @click="handleoperate(row,'T01000000000001')" type="success"
              size="small">确认</el-button>
            <el-button v-if="row.Row_Status=='4'&&row.Trading_Detail_SerialNumber.includes('T01000000000002_1')"
              :loading="loading" @click="handleoperate(row,'T01000000000002')" type="success"
              size="small">确认</el-button>
            <el-button v-if="row.Row_Status=='5'&&row.Trading_Detail_SerialNumber.includes('T01000000000003_1')"
              :loading="loading" @click="handleoperate(row,'T01000000000003')" type="success"
              size="small">确认</el-button>
            <el-button v-if="row.Row_Status=='6'&&row.Trading_Detail_SerialNumber.includes('T01000000000004_1')"
              :loading="loading" @click="handleoperate(row,'T01000000000004')" type="success"
              size="small">确认</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-dialog title="选择时间" width="30%" :visible.sync="dialogVisible">
      <el-date-picker v-model="time" value-format="timestamp" type="datetimerange" range-separator="至"
        start-placeholder="开始时间" end-placeholder="截止时间"></el-date-picker>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button @click="onDetails" type="primary">筛选</el-button>
      </div>
    </el-dialog>
    <el-dialog title="导入订单" :visible.sync="dialogVisible1">
      <input type="file" id="inputfile" name="file">
      <el-table :data="form2">
        <el-table-column label="序号" width="50" type="index"></el-table-column>
        <el-table-column prop="Sales_Order_SerialNumber" label="订单号">
        </el-table-column>
        <el-table-column prop="LogisticsNumbers" label="物流单号">
        </el-table-column>
        <el-table-column prop="Logistics_Date" label="发货时间">
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible1 = false">取消</el-button>
        <el-button type="primary" @click="subFile">导入</el-button>
        <el-button type="primary" id="btn" :loading="loading" @click="addEnterprise">提交</el-button>
      </div>
    </el-dialog>

    <el-dialog @close="qing_sales_order_logistics" width="80%" title="物流信息" :visible.sync="OddNumbers">
      <el-form :model="sales_order_logistics" inline-message="true">
        <div class="table_titel">
          <div class="titel">物流明细 </div>

          <div>总数: {{Quantity}}</div>
          <el-checkbox v-model="checked" @change="SelfPickup">是否自提</el-checkbox>
          <div class="operation">
            <el-button type="primary" size="small" @click="add_sales_order_logistics">新增</el-button>
            <el-button type="danger" size="small" @click="remove_sales_order_logistics">删除</el-button>
          </div>
        </div>
        <el-descriptions :column="4" border size="small" v-for="(item,index) in sales_order_logistics" :key="index">
          <el-descriptions-item label="快递公司">
            <el-form-item>
              <el-select :disabled="item.disabled1" v-model.trim="item.LogisticsCode" placeholder="请选择快递公司" filterable
                style="width: 100%">
                <el-option v-for="(item,index) in expressCompany" :key="item.Logistics_Company_SerialNumber"
                  :label="item.Logistics_Company" :value="item.Logistics_Company_Code"></el-option>
              </el-select>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="物流单号">
            <el-form-item>
              <el-input :disabled="item.disabled1" v-model.trim="item.LogisticsNumbers"
                placeholder="请输入物流单号"></el-input>
            </el-form-item>
          </el-descriptions-item>
          <el-descriptions-item label="数量">
            <el-form-item>
              <el-input v-model.trim="item.Quantity" type="NumBer" placeholder="请输入数量"></el-input>
            </el-form-item>
          </el-descriptions-item>
        </el-descriptions>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="OddNumbers = false">取 消</el-button>
        <el-button type="primary" :loading="loading" @click="addOddNumbers">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="订单分配" width="50%" :visible.sync="dialogVisible2">
      <el-table :data="multipleSelection">
        <el-table-column label="序号" width="50" type="index"></el-table-column>
        <el-table-column property="Sales_Order_Detail_SerialNumber" label="订单号"></el-table-column>
        <el-table-column prop="Store_Name" label="门店"></el-table-column>
        <el-table-column prop="Article_Name" label="商品"></el-table-column>
        <el-table-column property="Quantity" label="数量"></el-table-column>
        <el-table-column label="分配供应商" type="index" width="180">
          <template slot-scope="scope">
            <el-select v-model="form3.Supplier_SerialNumber" placeholder="请选择供应商">
              <el-option v-for="(item,index) in supplier" :label="item.Supplier_Name"
                :value="item.Supplier_SerialNumber"></el-option>
            </el-select>
          </template>
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible2 = false">取消</el-button>
        <el-button type="primary" :loading="loading" @click="submitForm">提交</el-button>
      </div>
    </el-dialog>

    <el-pagination style="position: fixed;bottom: 0;" background v-show="total > 0" @size-change="handleSizeChange"
      @current-change="handleCurrentChange" :current-page="form.page" :page-sizes="[10,50,100,500,1000]"
      :page-size="form.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
    </el-pagination>
  </div>
  <script type="text/javascript" src="../../../js/jquery-3.6.0.min.js"></script>
  <script type="text/javascript" src="../../../js/jquery.cookie.js"></script>
  <script type="text/javascript" src="../../../js/vue.min.js"></script>
  <script type="text/javascript" src="../../../elementUI/index.js"></script>
  <script type="text/javascript" src="../../../js/utils.js"></script>
  <script type="text/javascript" src="../../../js/FileSaver.min.js"></script>
  <script type="text/javascript" src="../../../js/FileSaver.js"></script>
  <script type="text/javascript" src="../../../js/xlsx.full.min.js"></script>
  <script type="text/javascript" src="./js/SalesOrder.js"></script>
</body>

</html>